<template>
    <div class="home">
        <h1>home</h1>
        <h1>{{ count }}</h1>
        <h1>{{ evenOrOdd }}</h1>
        <button @click="add">加法</button>
        <button @click="decrementAct">减法</button>
    </div>
</template>

<script>
import { mapActions, mapGetters, mapMutations, mapState } from "vuex";
export default {
    mounted(){
        console.log(this.$store);
    },
    //在computed中调用state和getters当中的数据
    computed:{
        ...mapState(['count','info']),
        ...mapGetters(['evenOrOdd']),
    },
    methods:{
        ...mapActions(['decrementAct']),
        ...mapMutations(['add']),
    }
}
</script>

<style lang="scss" scoped>
.home {
    width: 300px;
    height: 300px;
    border: 2px solid red;
}
</style>